<template>
  <div class="parent">
    <header-tab :config="tabConfig"></header-tab>
    <div class="main">
      <router-view />
    </div>
    <footer-tab :bottom-active="bottomActive"></footer-tab>
  </div>
</template>

<script>
  import headerTab from '../components/header-tab.vue'
  import footerTab from '../components/footer-tab.vue'
  import msgCards from '../components/msg-cards.vue'
  //    import MsgService from '../assets/js/fetch_service/msg.js'
  export default{
    components: {
      headerTab,
      msgCards,
      footerTab
    },
    data () {
      return {
        bottomActive: 1,
        loadTabs: true,
        tabConfig: {
          parent: {
            arr: [{name: '咨询', path: 'consultation'}, {name: '问答', path: 'answers'}],
            activeIndex: 0
          }
        }
      }
    }
  }
</script>

<style scoped lang="scss">
  .parent{
    width: 100%;
    height: 100%;
    background: #f9f9f9;
    display: flex;
    flex-direction: column;
  }
  .main{
    width: 100%;
    height: 100%;
    overflow-y: auto;
    margin-bottom: 50px;
  }
</style>
